<div class="modal-header">
    <h3 class="modal-title">VHOST配置</h3>
</div>
<div class="modal-body">
    <form class="bs-example form-horizontal">


        <div class="wrapper-md">
            <!-- toaster directive -->
            <toaster-container
                    toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>

            <uib-tabset>
                <uib-tab index="0" heading="环境配置">
                    <div style="font-size:1em;">&nbsp;</div>
                    <div class="form-group">
                        <div class="col-md-6">
                            <label class="col-lg-4 control-label">虚拟主机名称
                            </label>
                            <div class="col-lg-8">
                                <input type="text" class="form-control" ng-disabled=true
                                       ng-model="item.serverName">
                            </div>
                        </div>

                        <div class="col-md-6">
                            <label class="col-lg-4 control-label">虚拟主机Key
                            </label>
                            <div class="col-lg-8">
                                <input type="text" class="form-control" ng-disabled=true
                                       ng-model="item.serverKey">
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-6">
                            <label class="col-lg-4 control-label"><span style="color: #ec2121;">*</span>环境类型</label>
                            <div class="col-lg-8">
                                <select class="form-control" ng-model="nowEnv.envType"
                                        ng-options="envItem.code as envItem.name for envItem in envType" required>
                                    <option value="">--请选择--</option>
                                </select>
                            </div>
                        </div>


                        <div class="col-md-6">
                            <label class="col-lg-4 control-label">自动配置</label>
                            <div class="col-lg-8">
                                <label style="margin-top:5px;">
                                    <input type="checkbox" ng-model="nowEnv.autoBuild"><b style="margin-left:10px;">生成Upstream配置</b>
                                </label>
                            </div>
                        </div>

                    </div>
                    <div class="form-group">
                        <label class="col-lg-2 control-label"><span style="color: #ec2121;">*</span>配置文件路径
                        </label>
                        <div class="col-lg-10">
                            <input type="text" class="form-control" placeholder="基础路径"
                                   ng-model="nowEnv.confPath">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-2 control-label">说明</label>
                        <div class="col-lg-10">
                            <textarea class="form-control" cols="3" ng-model="nowEnv.content"></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <div style="text-align:center;">
                            <!--保存-->
                            <button ng-click="saveItem()"
                                    class="btn btn-xs"
                                    style="margin-left: 5px; background-color: #2e6da4; color: white;">
                                <span class="glyphicon glyphicon-ok"></span>保存
                            </button>

                            <button ng-click="resetItem()"
                                    class="btn btn-xs"
                                    style="margin-left: 5px; background-color: #449d44; color: white;">
                                <span class="glyphicon glyphicon-repeat"></span>重置
                            </button>

                            <!--<span class="glyphicon glyphicon-save" ng-click="saveServerItem(insideip, publicip)"></span>-->
                            <!--<span class="glyphicon glyphicon-repeat" style="margin-left: 20px;" ng-click="resetServerItem()"></span>-->
                        </div>
                    </div>
                    <div style="margin-top: 5px;">
                        <table class="table table-hover table-bordered table-striped">
                            <thead>
                            <tr>
                                <td class="col-md-2">环境</td>
                                <td>配置文件路径</td>
                                <td class="col-md-3">操作</td>
                            </tr>
                            </thead>
                            <tbody>
                            <tr ng-repeat="env in item.envList">
                                <td>
                                    <b style="color: #777" ng-if="env.envType == 0">保留</b>
                                    <b style="color: #5bc0de" ng-if="env.envType == 1">dev</b>
                                    <b style="color: #449d44" ng-if="env.envType == 2">daily</b>
                                    <b style="color: #ec971f" ng-if="env.envType == 3">gray</b>
                                    <b style="color: #d9534f" ng-if="env.envType == 4">prod</b>
                                    <b style="color: #5e5e5e" ng-if="env.envType == 5">test</b>
                                    <b style="color: #286090" ng-if="env.envType == 6">back</b>
                                </td>
                                <td>{{env.confPath}}</td>
                                <td>
                                    <button ng-click="editEnv(env)"
                                            class="btn btn-xs"
                                            style="margin-left: 20px; background-color: #2e6da4; color: white;">
                                        <span class="glyphicon glyphicon-edit"></span>编辑
                                    </button>

                                    <button ng-click="delEnv(env.id)"
                                            class="btn btn-xs pull-right"
                                            uib-popover-html="'删除环境配置'" popover-trigger="'mouseenter'"
                                            style="background-color: red; color: white;">
                                        <span class="glyphicon glyphicon-log-out"></span>删除
                                    </button>
                                </td>
                            </tr>
                            </tbody>
                            <tfoot>
                            </tfoot>
                        </table>
                    </div>
                </uib-tab>

                <uib-tab index="1" heading="配置文件">
                    <div style="font-size:1em;">&nbsp;</div>

                    <div class="form-group">
                        <div class="col-md-6">
                            <label class="col-lg-4 control-label"><span style="color: #ec2121;">*</span>环境类型</label>
                            <div class="col-lg-8">
                                <select class="form-control" ng-model="nowEnv.selected"
                                        ng-options="env as env.envName for env in item.envList" required>
                                    <option value="">--请选择--</option>
                                </select>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <label class="col-lg-4 control-label"><span style="color: #ec2121;">*</span>配置文件</label>
                            <div class="col-lg-8">
                                <select class="form-control" ng-model="nowFile.selected"
                                        ng-options="file as file.fileKey for file in nowEnv.selected.envFiles" required>
                                    <option value="">--请选择--</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-lg-2 control-label"><span style="color: #ec2121;">*</span>配置文件路径
                        </label>
                        <div class="col-lg-10">
                            <input type="text" class="form-control" placeholder="相对路径"
                                   ng-model="nowFile.selected.filePath">
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-md-6">
                            <label class="col-lg-4 control-label">配置文件名称
                            </label>
                            <div class="col-lg-8">
                                <input type="text" class="form-control"
                                       ng-model="nowFile.selected.fileName">
                            </div>
                        </div>

                        <div class="col-md-6">
                            <label class="col-lg-4 control-label">配置文件Key
                            </label>
                            <div class="col-lg-8">
                                <input type="text" class="form-control" ng-disabled=true
                                       ng-model="nowFile.selected.fileKey">
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <div style="text-align:center;">
                            <!--保存-->
                            <button ng-click="saveFile()"
                                    class="btn btn-xs"
                                    style="margin-left: 5px; background-color: #2e6da4; color: white;">
                                <span class="glyphicon glyphicon-ok"></span>保存
                            </button>

                            <button ng-click="resetFile()"
                                    class="btn btn-xs"
                                    style="margin-left: 5px; background-color: #449d44; color: white;">
                                <span class="glyphicon glyphicon-repeat"></span>重置
                            </button>
                        </div>
                    </div>


                </uib-tab>

                <uib-tab index="2" heading="服务器组">
                    <div style="font-size:1em;">&nbsp;</div>

                    <div class="form-group">
                        <div ng-include="'tpl/modal/public/pub_select_servergroup.html'"></div>
                    </div>


                    <div style="margin-top: 5px;">
                        <table class="table table-hover table-bordered table-striped">
                            <thead>
                            <tr>
                                <td>服务器组</td>
                                <td>使用类型</td>
                                <td class="col-md-2">操作</td>
                            </tr>
                            </thead>
                            <tbody>
                            <tr ng-repeat="item in vhostServerGroups">
                                <td>
                                    <b style="color: #286090">{{item.groupName}}</b>
                                    <!--<b class="pull-right" style="color: #777">组</b>-->
                                    <!--服务器描述-->
                                    <b style="color: #777">{{item.serverGroupDO.content}}</b>
                                </td>
                                <td>
                                    <b ng-if="item.serverGroupDO.useType == 10">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b ng-if="item.serverGroupDO.useType == 1">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #990000" ng-if="item.serverGroupDO.useType == 2">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #ec971f" ng-if="item.serverGroupDO.useType == 3">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b ng-if="item.serverGroupDO.useType == 4">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b ng-if="item.serverGroupDO.useType == 5">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #286090" ng-if="item.serverGroupDO.useType == 6">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #d9534f" ng-if="item.serverGroupDO.useType == 7">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #449d44" ng-if="item.serverGroupDO.useType == 8">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: #5bc0de" ng-if="item.serverGroupDO.useType == 9">{{item.serverGroupUseTypeDO.typeName}}</b>
                                    <b style="color: black" ng-if="item.serverGroupDO.useType > 9">{{item.serverGroupUseTypeDO.typeName}}</b>
                                </td>
                                <td>
                    <span class="glyphicon glyphicon-remove pull-right"
                          style="color: #d9534f"
                          uib-popover-html="'移除'" popover-trigger="'mouseenter'"
                          ng-click="delServerGroup(item.id)">
                    </span>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>

                </uib-tab>
            </uib-tabset>
        </div>

    </form>


    <div ng-if="alert.type != ''">
        <div uib-alert ng-class="'alert-' + alert.type" close="closeAlert()">{{alert.msg}}</div>
    </div>


</div>